<!--酒店搜索-->
<template>
  <div class="hotel-searchbar clearfix">
    <div class="hs-item hs-item-search" id="_j_hotel_search">
      <input type="text" :value="hotersear.nainiang" id="_j_search_input" autocomplete="off">
      <div class="hotel-suggest simsun" id="_j_search_suggest" style="display:none;"></div>
      <a class="hs-icon hs-icon-search" href="javascript:;" id="_j_search_btn"></a>
    </div>

    <div class="hs-item hs-item-date-wrapper" id="_j_booking_date">
      <div class="hs-item hs-item-date text-left" id="_j_check_in_date">
        <span></span>
        <input type="text" placeholder="入住日期" readonly>
        <i class="hs-icon hs-icon-date"></i>
      </div>
      <div class="hs-item hs-item-date text-left" id="_j_check_out_date">
        <span></span>
        <input type="text" placeholder="离店日期" readonly>
        <i class="hs-icon hs-icon-date"></i>
      </div>
    </div>
    <div class="hs-item hs-item-people text-left" id="_j_booking_number_guests">
      <span>人数</span>
      <i class="icon-person"></i>
    </div>
    <!--点击按钮价格-->
    <div class="hs-item hs-item-action">
      <a class="hs-btn" href="javascript:" v-on:click="query">查看价格</a>
    </div>
  </div>
</template>

<script>
  export default {
    props: ["hotersear"],
    data() {
      return {
        value1: ""
      };
    },
    methods: {
      query() {
        const keyword = document.getElementById("_j_search_input").value;
        if (keyword!=null && keyword!==''){
          this.$emit("query",keyword);
        }
      }
    }
  };
</script>

<style scoped>
  .text-left{
    text-align: left;
  }
</style>
